import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
          title: const Center(
        child: Text("商品列表"),
      )),
      body: MyHomeBody(),
    );
  }
}

class MyHomeBody extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ListView(
      children: <Widget>[
        MyHomeProductItem("Nova 8", "8 + 128G 深海蓝",
            "https://img1.baidu.com/it/u=2957799721,616591760&fm=253&fmt=auto&app=138&f=JPEG?w=667&h=500"),
        MyHomeProductItem("P50", "没有 5G",
            "https://img1.baidu.com/it/u=1506634078,1185354152&fm=253&fmt=auto&app=138&f=JPEG?w=747&h=500"),
        MyHomeProductItem("畅想 20 plus", "5G 星河银",
            "https://img1.baidu.com/it/u=3150469585,2946240303&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500"),
      ],
    );
  }
}

class MyHomeProductItem extends StatelessWidget {
  final String title;
  final String desc;
  final String imageURL;

  var style1 = const TextStyle(fontSize: 20, color: Colors.orange);
  var style2 = const TextStyle(fontSize: 20, color: Colors.green);
  var size = const SizedBox(height: 9);

  MyHomeProductItem(this.title, this.desc, this.imageURL);

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.all(10),
      decoration: BoxDecoration(border: Border.all(width: 5,color: Colors.blueGrey)),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.end,
        children: [
          Image.network(imageURL),
          size,
          Text(title, style: style1),
          size,
          Text(desc, style: style2)
        ],
      ),
    );
  }
}
